import { createApp } from 'vue'
import './style.css'
import * as ElementUI from 'element-plus'
// vuex 状态管理仓库
import { store, key } from '@/store/index'
import App from './App.vue'
// 路由
import router from "./router"
// 图标
import * as ElementPlusIconsVue from '@element-plus/icons-vue'
// I18n
import I18n from './i18n/index'
const app = createApp(App)
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
  app.component(key, component)
}
// 导入仓库
// import store from './store'
app.use(router).use(store, key).use(I18n).mount('#app')
// 声明全局变量属性
declare module '@vue/runtime-core' {
  interface ComponentCustomProperties {
    $confirm: (a: string) => Promise<void>
    $Alert: any
    $Notify: any
  }
}
//   声明全局变量
app.config.globalProperties.$confirm = ElementUI.ElMessageBox.confirm
app.config.globalProperties.$Alert = ElementUI.ElMessageBox.alert
app.config.globalProperties.$Notify = ElementUI.ElNotification

// 自定义指令
app.directive('btn', {
  // 参数1，当前实例
  // 参数2，接收参数
  mounted(el, binding) {
    console.log(binding);
    // 判断是否存在 该值 
    if (!store.state.buttonState.buttonlist.includes(binding.value)) {
      // 移除元素
      el.parentNode.removeChild(el)
    }
  }
})
